<template>
  <div>
    <div class="da">
      <img class="lx-img" src="./images/concat.jpg">
      <div class="xiao">
        <h5>
          做让人感到幸福的产业!
        </h5>
      </div>
    </div>
    <!--联系我们 地址-->
    <div class="yun">
      <div class="yun1">
        <h5>联系我们</h5>
      </div>

      <div class="yun2">
        <div class="yun2-1">
          <p>全国客服热线：</p>
          <h1>
            15666666666
          </h1>
          <p>
            贵州理工医疗器材股份有限公司
          </p>
          <p>
            地址：花溪大学城贵州理工学院
          </p>
          <p>
            电话：10086
          </p>
          <p>
            网址：
            <a href="http://baidu.com">http://www.baidu.com</a>
          </p>
        </div>
      </div>
      <div class="yun3"></div>
    </div>
  </div>
</template>

<script>
export default {
  name: "Contact"
}
</script>

<style>
*{
  margin: 0;
  padding: 0;
}
/* 中间图片问题  */
.da{
  width: 100%;
  height: 266px;
  position: relative;
}
.da img{
  width: 100%;
  height: 266px;
}
.da > div{
  width: auto;
  margin: 10px;
}
.xiao {
  position: absolute;
  top: 33%;
  left: 36%;
  font-size: 77px;
  color: white;
}

/*    联系我们  */
.yun{
  position: relative;
  z-index: 999;
  width: 70%;
  height: 400px;
  background-color: white;
  margin: -60px auto 1rem auto;
  padding: 0 0 1rem;
}
.yun > div{
  width: auto;
  /*margin: 10px;*/
}


.yun1{
  width: 100%;
  height: 80px;
  border-bottom: 1px solid black;
  margin-top:0px;
  /*background-color: white;*/
  font-size:40px;
  position: relative;
}
.yun1 > h5{
  width: auto;
}
.yun1 h5{
  position: relative;
  top: 10px;
  left: 30px;
}
.yun2{
  width: 300px;
  height: 300px;
}
.yun2 > div{
  width: auto;
}

.yun2-1{
  width: 250px;
  height: 250px;
  /*background-color: pink;*/
  position: relative;
  top: 50px;
}
</style>
